<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>人员展示</title>
    <meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="resources/bootstrap/css/bootstrap.min.css">
	<script src="resources/common/jquery/jquery-3.2.1.min.js"></script>
	<script src="resources/bootstrap/js/bootstrap.min.js"></script>
	<!-- 分页 -->
	<script src="resources/common/js/bootstrap-paginator.js"></script>
	<script src="resources/common/js/qunit-1.11.0.js"></script>
	<link rel="stylesheet" href="resources/common/css/qunit-1.11.0.css">
    <link rel="stylesheet" href="resources/common/css/bootstrap-responsive.css">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  <script type="text/javascript">
  $(function(){
    test("pagecontrol", function(){
        var element = $('#bp-element');
        options = {
            bootstrapMajorVersion:3, //对应的bootstrap版本
            currentPage: ${page.cunrrentPage }, //当前页数，这里是用的EL表达式，获取从后台传过来的值
            numberOfPages: ${page.pageSize }, //每页页数
            totalPages:${page.totalPage }, //总页数，这里是用的EL表达式，获取从后台传过来的值
            shouldShowPage:true,//是否显示该按钮
            itemTexts: function (type, page, current) {//设置显示的样式，默认是箭头
                switch (type) {
                    case "first":
                        return "首页";
                    case "prev":
                        return "上一页";
                    case "next":
                        return "下一页";
                    case "last":
                        return "末页";
                    case "page":
                        return page;
                }
            },
            //点击事件
            onPageClicked: function (event, originalEvent, type, page) {
                location.href = "user/selectusers.do?page=" + page;
            }
        };
        element.bootstrapPaginator(options);
    })
});
</script>
  <body>
   <div>
    	<table class="table table-striped table-bordered table-hover" id="users">
    		<tr class="info">
    			<th>
	    			<div class="checkbox">
					  <label>
					    <input type="checkbox" id="allu" value="1" aria-label="..." onclick="allselect();">
					  </label>
					</div>
    			</th>
    			<th>姓名</th>
    			<th>地址</th>
    			<th>邮箱</th>
    			<th>电话</th>
    			<th>角色</th>
    			<th>状态</th>
    		</tr>
    		<c:forEach items="${page.list}" var="u">
    		<tr class="success"  onclick="moused(this);">
    			<td>
	    			<div class="checkbox">
					  <label>
					    <input type="checkbox" class="oneu" value="${u.id}" aria-label="...">
					  </label>
					</div>
    			</td>
    			<td>${u.name}</td>
    			<td>${u.addr}</td>
    			<td>${u.email}</td>
    			<td>${u.tel}</td>
    			<td>${u.role.roleName}</td>
    			<td>
	    			<c:if test="${u.status == '1'}">
	    				<c:out value="作废"></c:out>
	    			</c:if>
	    			<c:if test="${u.status != '1'}">
	    				<c:out value="正常"></c:out>
	    			</c:if>
    			</td>
    		</tr>
    		</c:forEach>
    		
		</table>
    </div>
    <div class="pull-right">
    	<ul class="pagination" id="bp-element"></ul>
    </div>
  </body>
</html>
